<template>
  <view class="flex-col page">
    <view class="flex-col group">
      <view class="flex-col">
       <view class="flex-col group_2">
          <view class="justify-between group_3">
            <view class="flex-row">
              <image
                src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b14c62d02982001153329a/16557867941336379202.png"
                class="image_1"
              />
              <view class="group_5">
                <text class="text_3">基础版巡检</text>
                <text class="text_4">(10次)</text>
              </view>
            </view>
            <text class="text_5">(3/10)</text>
          </view>
          <view class="flex-col list-item section_3">
            <view class="flex-col">
              <view class="flex-row">
                <image
                  src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b14c62d02982001153329a/16557868145920698024.png"
                  class="image_2"
                />
                <text class="text_6">第1次巡检</text>
              </view>
              <text class="text_8">巡检工序：墙体改拆</text>
              <text class="text_10">巡检子项目：拆除验收</text>
              <text class="text_12">巡检时间：2022/10/10</text>
            </view>
            <view class="justify-end group_8">
              <view class="flex-col items-center text-wrapper"><text class="text_14">查看详情</text></view>
              <view class="flex-col items-center text-wrapper_1"><text class="text_16">已评价</text></view>
            </view>
          </view>
          <view class="flex-col list-item">
            <view class="flex-col">
              <view class="flex-row">
                <image
                  src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b14c62d02982001153329a/16557868145957639442.png"
                  class="image_2"
                />
                <text class="text_6">第2次巡检</text>
              </view>
              <text class="text_8">巡检工序：墙体改拆</text>
              <text class="text_10">巡检类型：拆除验收</text>
              <text class="text_12">巡检时间：2022/10/10</text>
            </view>
            <view class="justify-end group_8">
              <view class="flex-col items-center text-wrapper"><text class="text_14">查看详情</text></view>
              <view class="flex-col items-center text-wrapper_1"><text class="text_16">已评价</text></view>
            </view>
          </view>
          <view class="flex-col list-item">
            <view class="flex-col">
              <view class="flex-row">
                <image
                  src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b14c62d02982001153329a/16557868145972398836.png"
                  class="image_2"
                />
                <text class="text_6">第3次巡检</text>
              </view>
              <text class="text_8">巡检工序：墙体改拆</text>
              <text class="text_10">巡检类型：拆除验收</text>
              <text class="text_12">巡检时间：2022/10/10</text>
            </view>
            <view class="justify-end group_8">
              <view class="flex-col items-center text-wrapper"><text class="text_14">查看详情</text></view>
              <view class="flex-col items-center text-wrapper_2"><text class="text_29">评价</text></view>
            </view>
          </view>
          <view class="flex-col list-item_1">
            <view class="flex-col group_13">
              <view class="flex-row">
                <image
                  src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b14c62d02982001153329a/16557868146002389031.png"
                  class="image_2"
                />
                <text class="text_30">第4次巡检</text>
              </view>
              <text class="text_31">巡检工序：—</text>
              <text class="text_32">巡检类型：—</text>
              <text class="text_33">巡检时间：—</text>
            </view>
            <view class="flex-col items-center text-wrapper_3"><text class="text_34">查看详情</text></view>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
  export default {
    components: {},
    data() {
      return {};
    },
    methods: {},
  };
</script>

<style scoped lang="scss">
  .list-item {
    margin-top: 20rpx;
    padding: 22rpx 24rpx 24rpx;
    background-color: #ffffff;
    border-radius: 16rpx;
  }
  .text-wrapper {
    margin-right: 16rpx;
    padding: 9rpx 0 19rpx;
    background-color: #f6f7f9;
    border-radius: 28rpx;
    width: 148rpx;
    height: 56rpx;
  }
  .text-wrapper_1 {
    padding: 11rpx 0 19rpx;
    background-color: #1d6aff14;
    border-radius: 28rpx;
    width: 148rpx;
    height: 56rpx;
  }
  .image_2 {
    margin-top: 14rpx;
    border-radius: 50%;
    width: 17rpx;
    height: 17rpx;
  }
  .text_14 {
    color: #333333;
    font-size: 24rpx;
    font-family: '.AppleSystemUIFont';
   
  }
  .text_16 {
    color: #1d6aff;
    font-size: 24rpx;
    font-family: '.AppleSystemUIFont';
   
  }
  .group_8 {
    margin-top: 27rpx;
  }
  .text_8 {
    margin-top: 31rpx;
    align-self: flex-start;
    color: #333333;
    font-size: 26rpx;
    font-family: '.AppleSystemUIFont';
  
  }
  .text_10 {
    margin-top: 23rpx;
    align-self: flex-start;
    color: #333333;
    font-size: 26rpx;
    font-family: '.AppleSystemUIFont';
   
  }
  .text_12 {
    margin-top: 29rpx;
    align-self: flex-start;
    color: #333333;
    font-size: 26rpx;
    font-family: '.AppleSystemUIFont';
   
  }
  .text_6 {
    margin-left: 12rpx;
    color: #333333;
    font-size: 28rpx;
    font-family: '.AppleSystemUIFont';
   
  }
  .page {
    background-color: #f6f7f9ff;
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    height: 100%;
  }
  .group {
    flex: 1 1 auto;
    overflow-y: auto;
  }
  .section_1 {
    padding-left: 160rpx;
    padding-right: 159rpx;
    background-color: #ffffff;
  }
  .group_2 {
    padding: 0 22rpx 32rpx 24rpx;
  }
  .group_1 {
    padding: 31rpx 0 25rpx;
  }
  .section_2 {
    margin-right: 32rpx;
    align-self: flex-end;
    background-color: #1d6aff;
    border-radius: 4rpx;
    width: 50rpx;
    height: 8rpx;
  }
  .group_3 {
    padding: 41rpx 0 21rpx 8rpx;
  }
  .section_3 {
    margin-top: 0;
  }
  .list-item_1 {
    margin-top: 20rpx;
    padding: 0 24rpx 24rpx;
    background-color: #ffffff;
    border-radius: 16rpx;
  }
  .text_1 {
    color: #666666;
    font-size: 28rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 33rpx;
  }
  .text_2 {
    color: #333333;
    font-size: 28rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 33rpx;
  }
  .text_5 {
    color: #1d6aff;
    font-size: 24rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 28rpx;
  }
  .group_13 {
    padding: 22rpx 0 33rpx;
  }
  .text-wrapper_3 {
    padding: 9rpx 0 19rpx;
    align-self: flex-end;
    background-color: #f6f7f9;
    border-radius: 28rpx;
    width: 148rpx;
  }
  .image_1 {
    margin-top: 5rpx;
    flex-shrink: 0;
    width: 26rpx;
    height: 16rpx;
  }
  .group_5 {
    margin-left: 12rpx;
    height: 38rpx;
  }
  .text-wrapper_2 {
    padding: 12rpx 0 19rpx;
    background-color: #1d6aff;
    border-radius: 28rpx;
    width: 148rpx;
    height: 56rpx;
  }
  .text_31 {
    margin-top: 31rpx;
    align-self: flex-start;
    color: #333333;
    font-size: 26rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 30rpx;
  }
  .text_32 {
    margin-top: 23rpx;
    align-self: flex-start;
    color: #333333;
    font-size: 26rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 30rpx;
  }
  .text_33 {
    margin-top: 23rpx;
    align-self: flex-start;
    color: #333333;
    font-size: 26rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 30rpx;
  }
  .text_34 {
    color: #333333;
    font-size: 24rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 28rpx;
  }
  .text_3 {
    color: #333333;
    font-size: 32rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 38rpx;
  }
  .text_4 {
    color: #333333;
    font-size: 26rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 30rpx;
  }
  .text_29 {
    color: #f6f7f9;
    font-size: 24rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 28rpx;
  }
  .text_30 {
    margin-left: 12rpx;
    color: #333333;
    font-size: 28rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 33rpx;
  }
</style>